import React,{Component} from 'react'
import {Link,browserHistory} from 'react-router'
import * as fetch from '../config/fetch'
import { message } from 'antd';
import Layer from './Layer';
import * as pub from '../config/public'
class Course extends Component {
	constructor(props) {
		super(props);
		this.state = {
			course:this.props.item?this.props.item:[],
			visibleDH:false,
		}
		
	}
	componentWillReceiveProps(nextProps) {
    	this.setState({
			course:nextProps.item,
    	})
    }

	operate(id, type) {
		fetch.operateCourse(id, type).then((data) => {
			if (data.result === 'RC100') {
				this.props.courseClick();
				message.success(data.msg, 3);
			}else{
				message.error(data.errMsg, 3);
			}
		})
	}
	confirmBuy(id,type){
		let course = this.props.item;
		if(course.userCourseOperation.isBuy===1){
			if(id!==undefined){
				this.operate(course.courseId,type);//按收藏按钮
			}else{
				pub.jumpHistory.push("/CourseDetail/" +course.courseId);//按视频和文字
			}
		}else{
			this.setState({
				visibleDH:true,
			})
		}
	}
	ok(id,code){
		fetch.operateCourses(id,code).then((data)=>{
			if(data.result === 'RC100'){
				message.success(data.errMsg, 3);
				pub.jumpHistory.push("/CourseDetail/" +id)
			}else{
				message.error(data.errMsg, 3);
			}
		}, (res) => {
			pub.reject(res);
		})
	}
	clickCourse(course) {
		if (course.goodCourse === '1') {
			if (course.userCourseOperation.isBuy === 1) {
				pub.jumpHistory.push("/CourseDetail/"+course.courseId)
			} else {
				this.setState({
					visibleDH: true,
					courseId: course.courseId,
					studyIntegral: course.sumCollection
				})
			}
		} else {
			pub.jumpHistory.push("/CourseDetail/"+course.courseId)
		}
	}
	render(){
		let course=this.state.course;
		return(
			<div>
				<Link onClick={() => this.clickCourse(course)}>
						{/*<video src={pub.getFile(course.coursevideoPath)} alt='封面图片' />*/}
						<img alt='test' className="v-img" src={require("../style/images/test.png")}/>
						<div className="course-play play"><i className="icon-play"></i></div>
					<p className="title">{course.courseName?course.courseName:''}</p>
				</Link>
			          {
						course.goodCourse==='1'||course.goodCourse===1?<div className="jingDyCourse"></div>:null
					  }
					<p className="like" style={{color:'#000'}}>
						{course.goodCourse==='0'?
								<span style={{opacity:course.userCourseOperation.isCollection === 1 ? 1:0.4}} onClick={()=>this.operate(course.courseId,2)} >
								<i className="icon-heart" ></i>{course.sumCollection}</span>:
								<span style={{opacity:course.userCourseOperation.isCollection === 1 ? 1:0.4}} onClick={()=>this.confirmBuy(course.courseId,2)} >
								<i className="icon-heart" ></i>{course.sumCollection}</span>
						}
					</p>
					 <Layer 
				            title = "设置兑换积分"
				            show={this.state.visibleDH} 
				            hide={(e)=>{this.setState({visibleDH:false})}}
				            width="400px"
				            height="270px"
			                >
				            	<div className="row">
				            			<div className="pop-box-1"  style={{textAlign:'left'}}>																					
				            				<p style={{textAlign:'center'}}>您需要{course.studyIntegral}积分兑换该课程</p>																				
				            			</div>
				            			<div className="pop-btn">
				            				<a onClick={()=>{this.setState({visibleDH:false})}} className="btn btn-blue"  style={{borderRadius: '5px',marginRight:'50px'}}>取消</a>
				            				<a className="btn btn-blue" style={{borderRadius: '5px'}} onClick={()=>this.ok(course.courseId,course.userCode)}>确认
				            				</a>
				            			</div>
				            		</div>
			      </Layer>
			</div>
			)
	}
}
export default Course;